<template>
  <div class="ordermap-wrapper">
  	<div :id="mapid" class="order-map"></div>
  </div>
</template>

<script>
export default {
  props: {
    mapid: {
      type: String,
      default: 'ordermap'
    }
  },
	data: function () {
		return {
      numrgx: /^\d+(\.\d+)?$/
		}
	},
  mounted: function () {
    this.$nextTick(() => {
      this.mapinit();
    });
  },
  methods: {
    mapinit: function () {
      var id = this.mapid;
      var map = new AMap.Map(id, {
              resizeEnable: true,
              zoom: 1,
              center: [116.39, 39.9]
          });
      // var pointsobj = this.pointsobj;
      // var numrgx = this.numrgx;
      // var lnglat = null;
      // var iMarker = null;
      // pointsobj.forEach((item) => {
      //   if(numrgx.test(item.lat) && numrgx.test(item.lng)) {
      //     lnglat = new AMap.LngLat(item.lng, item.lat);
      //     item.label.offset = new AMap.Pixel(-5, -20);
      //     iMarker = new AMap.Marker({map: map, position: lnglat, label: item.label});
      //   }
      // });
      map.setFitView();
          // this.map=map;
          //定位
          map.plugin('AMap.Geolocation', function () {
            var geolocation = new AMap.Geolocation({
                enableHighAccuracy: true,//是否使用高精度定位，默认:true
                timeout: 10000,          //超过10秒后停止定位，默认：无穷大
                maximumAge: 0,           //定位结果缓存0毫秒，默认：0
                convert: true,           //自动偏移坐标，偏移后的坐标为高德坐标，默认：true
                showButton: true,        //显示定位按钮，默认：true
                //buttonPosition: 'LB',    //定位按钮停靠位置，默认：'LB'，左下角
                buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
                showMarker: true,        //定位成功后在定位到的位置显示点标记，默认：true
                showCircle: true,        //定位成功后用圆圈表示定位精度范围，默认：true
                panToLocation: true,     //定位成功后将定位到的位置作为地图中心点，默认：true
                zoomToAccuracy:true      //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
            });
            map.addControl(geolocation);
            geolocation.getCurrentPosition(function(status,result){
              map.setFitView();
            }.bind(this));
        }.bind(this));
    }
  }
}
</script>

<style>
  .ordermap-wrapper {
    width: 100%;
    height: 35%;
  }
  .order-map {
    width: 100%;
    height: 100%;
  }
</style>
